<template>
  <div :class="{'form_field_checked':formField?.checked === true}" class="form_field"
         style="cursor: pointer;"
         v-if=" formField?.delete !== true">
    <a-form-item
        :colon="false"
        style="padding-left: 10px;margin-top: 7px;"
        :label="formField?.fieldName"
    >
      <a-input v-if="formField?.fieldDataType === 'text'" readonly style="width: 100%"/>
      <a-input-number readonly v-if="formField?.fieldDataType === 'counter'"/>
      <a-date-picker v-if="formField?.fieldDataType === 'date'" disabled/>
      <a-radio-group v-if="formField?.fieldDataType === 'radio'" name="{{formField?.name}}">
        <a-radio value="1">A</a-radio>
        <a-radio value="2">B</a-radio>
        <a-radio value="3">C</a-radio>
      </a-radio-group>

      <a-upload readonly
                v-if="formField?.fieldDataType === 'file'"
                name="file"
                action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
      >
        <a-button :disabled="ext.disabled">
          <upload-outlined></upload-outlined>
          点击上传
        </a-button>
      </a-upload>
    </a-form-item>
  </div>
</template>

<script>
import {DeleteOutlined} from "@ant-design/icons-vue";


export default {
  name: "defField",
  components: {
    DeleteOutlined,
  },
  props: {
    formField: {},
    ext: {
      disabled: true
    },
  },
  setup() {
  },
  created() {
  },
  methods: {}
}
</script>

<style scoped>

</style>
